<template>
  <base-breadcrumb>
    <searchData
      :search-data="searchArr"
      @search="search"
    />
    <a-card :bordered="false">
      <!-- <title-name title="节点管控信息反馈列表" /> -->

      <div class="pub-table-select-count">
        <a-icon
          type="info-circle"
          theme="twoTone"
        />
        <span style="margin-right: 12px">
          总节点信息反馈数： <span class="totalNum">{{ totalDetails.nodeTotal }}</span>个 | 待反馈节点数 <span class="totalNum">{{ totalDetails.waitingNum }}</span> 个 | 已反馈节点数
          <span class="totalNum">{{ totalDetails.alreadyNum }}</span> 个</span>
      </div>

      <list-table
        ref="table"
        size="default"
        row-key="key"
        :columns="columns"
        :request="loadData"
        :alert="true"
        :pagination="false"
        show-size-changer
        show-quick-jumper
        show-pagination="auto"
      >
        <span
          slot="serial"
          slot-scope="text, record, index"
        >{{ index + 1 }}</span>
        <span
          slot="businessMatters"
          slot-scope="text, record, index"
        >
          <ellipsis
            :length="20"
            tooltip
          >{{ text }}</ellipsis>
        </span>
        <span
          slot="type"
          slot-scope="text, record, index"
        >
          <ellipsis
            :length="20"
            tooltip
          >{{ text }}</ellipsis>
        </span>
        <span
          slot="action"
          slot-scope="text, record"
        >
          <template>
            <a
              v-btnPermission="[{code:'seex_pm_013_loo_01',ident:'prma_seex'},{code:'buco_pm_013_loo_01',ident:'prma_buco'}]"
              @click="handleSub(record)"
            >查看</a>
            <span v-if="record.statusCode != '2'">
              <a-divider type="vertical" /><a
                v-btnPermission="[{code:'seex_pm_013_fed_02',ident:'prma_seex'},{code:'buco_pm_013_fed_02',ident:'prma_buco'}]"
                @click="handleEdit(record)"
              >反馈</a>
            </span>
          </template>
        </span>
      </list-table>

      <add-feedback
        ref="createModal"
        :visible="visible"
        :loading="confirmLoading"
        :model="mdl"
        @cancel="handleCancel"
        @ok="handleOk"
      />
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { STable, Ellipsis } from '@/components'
import { getFeedbacksList, addFeedbacks, getFeedbacksTotal } from '@/api/project/feedback'
import OrgTreeSelect from '@/components/OrgTreeSelect'
import addFeedback from './addFeedback'
import ARow from 'ant-design-vue/es/grid/Row'

const columns = [
  {
    title: '序号',
    width: 65,
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '业务事项',
    dataIndex: 'businessMatters',
    width: 100,
    scopedSlots: { customRender: 'businessMatters' }
  },
  {
    title: '项目名称',
    width: 100,
    dataIndex: 'projectName'
  },
  {
    title: '阶段/类型',
    dataIndex: 'type',
    width: 100,
    scopedSlots: { customRender: 'type' }
  },
  {
    title: '节点等级',
    width: 100,
    dataIndex: 'nodeLevel'
  },
  {
    title: '计划开始时间',
    width: 100,
    dataIndex: 'startTime'
  },
  {
    title: '计划结束时间',
    width: 100,
    dataIndex: 'endTime'
  },
  {
    title: '第一责任人',
    width: 100,
    dataIndex: 'responsible'
  },
  {
    title: '直接责任人',
    width: 100,
    dataIndex: 'responsiblEngineer'
  },
  {
    title: '状态',
    width: 100,
    dataIndex: 'statusName'
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 150,
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    Ellipsis,
    addFeedback
  },
  data() {
    this.columns = columns
    return {
      searchArr: [
        // 搜索框
        {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
        {
          name: '业务事项',
          value: 'businessMatters',
          type: 'input'
        },
        // {
        //   name: '项目名称',
        //   value: 'projectName',
        //   type: 'input'
        // },
        {
          name: '节点等级',
          value: 'nodeLevel',
          type: 'select',
          data: [
            {
              value: '',
              label: '全部'
            },
            {
              value: '1',
              label: '一级节点'
            },
            {
              value: '2',
              label: '二级节点'
            },
            {
              value: '3',
              label: '三级节点'
            }
          ]
        },
        {
          name: '状态',
          value: 'statusCode',
          type: 'select',
          data: [
            {
              value: '',
              label: '全部'
            },
            {
              value: '0',
              label: '待反馈'
            },
            {
              value: '1',
              label: '已反馈'
            }
          ]
        }
      ],

      nodeTotal: '', // 节点信息反馈总数
      waitingNum: '', // 待反馈
      alreadyNum: '', // 已反馈

      visible: false,
      confirmLoading: false,
      mdl: null,
      // 高级搜索 展开/关闭
      advanced: false,
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, { query: { ...this.queryParam } })
        return getFeedbacksList(requestParameters).then((res) => {
          console.log('返回123：', res)
          return res
        })
      },
      selectedRowKeys: [],
      selectedRows: [],
      totalDetails: {}
    }
  },

  created() {
    this.getFeedbacksTotal()
  },
  computed: {
    // rowSelection() {
    //   return {
    //     selectedRowKeys: this.selectedRowKeys,
    //     selectedRows: this.selectedRows,   // 当前行所有数据
    //     onChange: this.onSelectChange
    //   }
    // }
  },
  methods: {
    search(values) {
      // if(values.nodeLevel == "" || values.nodeLevel == null){
      //   this.queryParam = {}
      // }

      this.queryParam = values
      this.$refs.table.refresh(true)
      this.getFeedbacksTotal()
    },
    getFeedbacksTotal() {
      getFeedbacksTotal(this.queryParam).then((res) => {
        this.totalDetails = res.data
      })
    },
    handleSub(record) {
      // 查看详情
      this.$router.push({ path: '/feedback/details', query: { feedbackId: record.id } })
    },
    handleEdit(record) {
      this.visible = true
      this.mdl = { ...record }
    },
    handleOk(values) {
      // 新增
      // const form = this.$refs.createModal.$refs.ruleForm
      // console.log(form)
      values.id = this.mdl.id
      values.firstResId = this.mdl.firstResId
      values.directResPerId = this.mdl.directResPerId

      if (values.feedbackCode == '1' && (values.remark == '' || values.remark == undefined)) {
        this.$message.error('当不能按计划完成时，请填写备注！')
        return
      }
      this.confirmLoading = true
      let params = this.$clone(values)
      params.fileIdList = []
      if (params.fileInfos && params.fileInfos.length > 0) {
        params.fileInfos.forEach((e) => {
          params.fileIdList.push(e.commonId)
        })
        delete params.fileInfos
      }
      addFeedbacks(params).then(
        (res) => {
          if (res.data.code == 200) {
            this.visible = false
            this.confirmLoading = false

            // 刷新表格
            this.$refs.table.refresh(true)
            this.$message.success('反馈成功！')
            this.getFeedbacksTotal()
          } else {
            this.$message.error('反馈失败！')
            this.visible = false
          }
        },
        (err) => {
          this.visible = false
          this.confirmLoading = false
        }
      )
    },
    handleCancel() {
      this.visible = false
    },

    toggleAdvanced() {
      this.advanced = !this.advanced
    }
  }
}
</script>


